<template>
  <div>
    <!-- 图片查看器 2018/3/7 11:44 zhangQ -->
    <div>
      <ul ref="ul">
        <template v-for="item in imgsList">
          <li><img :src="item" style="width: 150px;margin: 5px;"></li>
        </template>
      </ul>
    </div>
  </div>
</template>

<script>
  import 'viewerjs/dist/viewer.min.css'
  import Viewer from 'viewerjs'

  export default {
    name: 'index',
    data () {
      let viewer = {}
      let datas = { viewer }
      return datas
    },
    props: {
      imgsList: {
        type: Array,
        default () {
          return []
        }
      }
    },
    computed: {},
    methods: {},
    created () {
    },
    mounted () {
      this.viewer = new Viewer(this.$refs['ul'], {
        viewed () {
          this.viewer.zoomTo(1)
        }
      })
    },
    components: {}
  }
</script>

<style scoped>
  ul li {
    display: inline;
  }
</style>
